import { hrmCertificateApi } from "@/api/HRMS/Certificate";
import { useDrawer } from "@/components/Drawer";
import { BasicColumn, BasicTable, FormSchema, TableAction, useTable } from "@/components/Table";
import Toolbar from "@/components/ViewComponents/Toolbar";
import { message, Image } from "antd";
import CreateAndUpdata from "./components/createAndUpdata";
import { useTranslation } from "react-i18next";
import { IconEnum } from "@/enums/appEnum";
const index = () => {
	const { t } = useTranslation();
	const ev_vi = "HRMS.certificate";
	const schemas: FormSchema[] = [
		{
			label: t(`${ev_vi}.staffName`),
			field: "staffName", //姓名
			component: "Input"
		},
		{
			label: t(`${ev_vi}.certificate`),
			field: "certName", //证书名称
			component: "Input"
		},
		{
			label: t(`${ev_vi}.certificateType`),
			field: "certType", //证书类型
			component: "Input"
		}
	];
	const columns: BasicColumn[] = [
		{
			title: t(`${ev_vi}.staffName`),
			dataIndex: "staffName"
		},
		{
			title: t(`${ev_vi}.certificate`), //证书名称
			dataIndex: "certName"
		},
		{
			title: t(`${ev_vi}.certificateType`),
			dataIndex: "certType" //证书类型
		},
		{
			title: t(`${ev_vi}.certificateNo`),
			dataIndex: "certNumb" //证书编号
		},
		{
			title: t(`${ev_vi}.issuingAuthority`),
			dataIndex: "issueAuthority" //发行机关
		},
		{
			title: t(`${ev_vi}.certificateLevel`),
			dataIndex: "certLevel" //证书等级
		},
		{
			title: t(`${ev_vi}.dateOfIssue`),
			dataIndex: "startDate" //发证日期
		},
		{
			title: t(`${ev_vi}.effectiveDate`),
			dataIndex: "endDate" //有效日期
		},
		{
			title: t(`${ev_vi}.certificateImage`),
			dataIndex: "certUrl", //证书图片
			render: (certUrl: string) => {
				return <Image width={50} src={certUrl} />;
			}
		},
		{
			title: t("kevin_ui.operate"),
			render: (_, record) => {
				return (
					<TableAction
						actions={[
							{
								icon: IconEnum.EDIT,
								label: t("felix_ui.edit"),
								onClick: upDate(record)
							},
							{
								icon: IconEnum.DELETE,
								label: t("felix_ui.delete"),
								popConfirm: {
									title: t("common.deleteMessage"),
									placement: "left",
									confirm: deleteFn.bind(null, record)
								}
							}
						]}
					></TableAction>
				);
			}
		}
	];
	const [register, { reload }] = useTable({
		api: hrmCertificateApi.hrmCertsPage,
		columns,
		useSearchForm: true,
		formConfig: {
			labelWidth: 100,
			schemas,
			showActionButtonGroup: true,
			baseColProps: { span: 6 },
			actionColOptions: { span: 24 }
		},
		bordered: false
	});
	const [registerDrawer, { openDrawer }] = useDrawer();
	const handlerToolbarAction = (key: string) => {
		switch (key) {
			case "add":
				openDrawer(true, {
					reload
				});
				break;
		}
	};
	const upDate = (record: any) => () => {
		openDrawer(true, {
			reload,
			record
		});
	};
	const deleteFn = async (record: any) => {
		const res = await hrmCertificateApi.hrmCertsDelete({ id: record.certId });
		if (!res) return message.error(t("kevin_ui.deleteFailed"));
		message.success(t("kevin_ui.daleteSucceessfully"));
		reload();
	};
	return (
		<div className="page">
			<div className="page-content">
				<BasicTable register={register}></BasicTable>
			</div>
			<CreateAndUpdata register={registerDrawer}></CreateAndUpdata>
			<Toolbar action={handlerToolbarAction} btnList={["add"]} />
		</div>
	);
};
export default index;
